import React, { PureComponent,Fragment } from "react";
import { connect } from "dva";
import router from 'umi/router';
import moment from "moment";
import { Row, Col, Upload, Spin, Card, Form, Button, Popconfirm, Divider } from "antd";
import DescriptionList from '../../../components/DescriptionList';
import DependentHistory from "./DependentHistory";
import styles from '../../Pbulic.less';

const FormItem = Form.Item;
const { Description } = DescriptionList;

@connect(({ warn, global }) => ({
  dictionaries:global.dictionaries,
  detaildata:warn.detaildata,
  loading:warn.loading.detailinfo,
}))
export default class DetailInfo extends PureComponent {
  constructor(props) {
    super(props);
  }

  componentDidMount() {
    const { detailInfoId, dispatch} = this.props;
    dispatch({
      type: "warn/fetch_warn_info",
      payload: {
        warnId: detailInfoId
      }
    });
  }

  // 关闭告警
  handleCloseWarn= (id) =>{
    this.props.closeWarnCallBack(id);
  }

  // 报修
  handleRepair = (row)=>{
    const { dispatch } = this.props;
    const info={
      devId:row.devId,
      devCode:row.devCode,
      devName:row.devName,
      districtId:row.districtId,
      pointId:row.pointId,
      maintenanceId:row.maintenanceId,
    }
    router.push({ pathname:'/fault/current/detail/add',  query: {...info}  });
  }

  // 维修跟进
  handleRepairHandle= (id)=>{
    const { dispatch } = this.props;
    id && router.push({ pathname:`/fault/current/${id}/handle`});
  }


  render() {
    const { detaildata, loading, dictionaries  } = this.props;

    const deviceType = dictionaries.deviceType && dictionaries.deviceType.length>0
      ? dictionaries.deviceType.map(item=>item.label)
      :[];

    const repairStatus = dictionaries.repairStatus && dictionaries.repairStatus.length>0
      ? dictionaries.repairStatus.map(item=>item.label)
      :[];


    return (
      <Fragment>
        {loading && <div className={"globalSpin"}><Spin spinning={loading}  /></div>}
        {
          !loading && detaildata && detaildata.warnId &&
          <Fragment>
            <Card bordered={false}>
              <DescriptionList size="large"
                               style={{ marginBottom: 32 }}
                               title={
                  <div className={styles.warn_info_button}>
                    <div className={styles.title}>告警信息</div>
                    {
                      detaildata.status=="01" ?
                        <div>
                          <Button  type="primary" onClick={() => this.handleRepair(detaildata)} style={{marginRight:15}} >
                            报修
                          </Button>
                          <Popconfirm title="是否确定要关闭?" onConfirm={() => this.handleCloseWarn({...detaildata,from:"info"})}  okText="是" cancelText="否">
                            <Button  type="danger" >
                              关闭告警
                            </Button>
                          </Popconfirm>
                        </div>
                        : detaildata.repairId ?
                        <div >
                          <Button  type="primary" style={{marginRight:15}}  onClick={() => this.handleRepairHandle(detaildata.repairId)} >
                            维修跟进
                          </Button>
                        </div>
                        : ''
                    }

                  </div>
              }
              >
                <Description term="告警ID">{detaildata.warnId}</Description>
                <Description term="告警发生时间">{detaildata.createTime && moment(detaildata.createTime).format("YYYY-MM-DD HH:mm")}</Description>
                <Description term="告警信息描述">{detaildata.warnCon}</Description>
              </DescriptionList>
              <Divider style={{ marginBottom: 32 }} />
              <DescriptionList size="large" title="设备信息" style={{ marginBottom: 32 }}>
                <Description term="设备编号">{detaildata.devCode}</Description>
                <Description term="设备名称">{detaildata.devName}</Description>
                <Description term="设备型号">{detaildata.devModel}</Description>
                <Description term="设备类型">{detaildata.devType && deviceType[parseInt(detaildata.devType)-1]}</Description>
                <Description term="设备品牌">{detaildata.trademark}</Description>
                <Description term="供货商">{detaildata.supplier}</Description>
                <Description term="安装地点">{detaildata.pointName}</Description>
              </DescriptionList>
              {
                detaildata.status=="01" && detaildata.devId &&
                <Fragment>
                  <Divider style={{ marginBottom: 32 }} />
                  <DescriptionList size="large" title="历史告警记录" style={{ marginBottom: 32 }}>
                    <DependentHistory
                      detailInfoId={detaildata.devId}
                      dictionaries={dictionaries}
                    />
                  </DescriptionList>
                </Fragment>
              }


              {
                detaildata.status!=="01" &&
                <Fragment>
                  <Divider style={{ marginBottom: 32 }} />
                  <DescriptionList size="large" title="维修单信息" style={{ marginBottom: 32 }}>
                    <Description term="持续时间">{detaildata.continueTime}</Description>
                    <Description term="维保单位">{detaildata.trademark}</Description>
                    <Description term="处理状态">{detaildata.repairStatus && repairStatus[parseInt(detaildata.repairStatus)-1]}</Description>
                    <Description term="处理描述" style={{clear:'both'}}>{detaildata.handleDesc}</Description>
                  </DescriptionList>
                </Fragment>
              }
            </Card>
          </Fragment>
        }
      </Fragment>
    );
  }
}
